<!--
  - Copyright (c) 2019.  武汉中科图灵科技有限公司
  - Date :  2019/1/5
  - Author ：F12 Console=> atob("MzMxNDkxODAwQHFxLmNvbQ==")
  - Version ：1.6.2
  -->

<template>
    <div class="app-container calendar-list-container no-padding" v-if="Show">
        <el-container>
            <el-container>
                <div class="flex-left-pannel">
                    <el-row>
                        <div class="xf-tabletop-handles">
                            <div class="xf-tabhd-left">
                                <el-button class="filter-item" @click="handleCreate" type="primary" v-show="showdownload">添加传感器</el-button>
                                <el-button plain @click="importFn" v-show="showdownload">导入表格</el-button>
                                <el-button type="text" @click="download" v-show="showdownload">下载表格模版</el-button>
                            </div>
                            <div class="xf-tabhd-right">
                                设备编号
                                <el-input v-model="listQuery.sensorNo" placeholder="请输入设备编号" class="xf-query-input"></el-input>
                                <el-button @click="tableQuery" type="primary">查询</el-button>
                                <el-popover
                                    placement="bottom-end"
                                    width="700"
                                    class="xf-custom-poper"
                                    @show="getSelected"
                                    v-model="visible2">
                                    <div class="xf-double-form">
                                        <div class="xf-dbform-item">
                                            <div class="xf-dbform-item__sleft">
                                               <p class="xf-dbform-item__label">状态</p>
                                               <el-select placeholder="请选择状态" v-model="slistQuery.status">
                                                    <el-option label="全部" value="-1"></el-option>
                                                    <el-option label="正常" value="2"></el-option>
                                                    <el-option label="故障" value="0"></el-option>
                                                    <el-option label="报警" value="1"></el-option>
                                                    <el-option label="离线" value="4"></el-option>
                                                    <el-option label="未启用" value="3"></el-option>
                                                </el-select>
                                            </div>
                                            <div class="xf-dbform-item__sright">
                                               <p class="xf-dbform-item__label">厂商</p>
                                               <el-select placeholder="请选择厂商" v-model="slistQuery.manufacturer">
                                                    <el-option :label="item" :value="item" v-for="item in manufeList" :key="item"></el-option>
                                                </el-select>
                                            </div>
                                        </div>
                                        <div class="xf-dbform-item">
                                            <div class="xf-dbform-item__sleft">
                                               <p class="xf-dbform-item__label">系列</p>
                                               <el-select placeholder="请选择系列" v-model="slistQuery.equipmentType">
                                                   <el-option :label="item" :value="item" v-for="item in equipmentTypeList" :key="item"></el-option>
                                                </el-select>
                                            </div>
                                            <div class="xf-dbform-item__sright">
                                               <p class="xf-dbform-item__label">所属系统</p>
                                               <el-select placeholder="请选择状态" v-model="slistQuery.channelId">
                                                    <el-option label="全部" value="-1"></el-option>
                                                    <el-option :label="item.channelName" :value="item.id" v-for="item in channelList" :key="item.id"></el-option>
                                                </el-select>
                                            </div>
                                        </div>
                                        <div class="xf-dbform-item">
                                            <div class="xf-dbform-item__sleft">
                                               <p class="xf-dbform-item__label">位置标记</p>
                                               <el-select placeholder="请选择状态" v-model="slistQuery.positionSign">
                                                    <el-option label="全部" value="-1"></el-option>
                                                    <el-option label="已标记" value="1"></el-option>
                                                    <el-option label="未标记" value="0"></el-option>
                                                </el-select>
                                            </div>

                                        </div>
                                        <div class="xf-dbform-item">
                                            <div class="xf-dbform-item__sleft">
                                               <p class="xf-dbform-item__label">型号</p>
                                               <el-input v-model="slistQuery.model" placeholder="请输入型号"></el-input>
                                            </div>
                                            <div class="xf-dbform-item__sright">
                                               <p class="xf-dbform-item__label">楼层</p>
                                               <el-input v-model="slistQuery.floorId" placeholder="请输入楼层"></el-input>
                                            </div>
                                        </div>
                                        <div class="xf-dbform-item">
                                            <div class="xf-dbform-item__sleft">
                                               <p class="xf-dbform-item__label">位置描述</p>
                                               <el-input v-model="slistQuery.positionDescription" placeholder="请输入位置描述"></el-input>
                                            </div>

                                        </div>
                                    </div>
                                    <div style="text-align: left; margin: 0; margin-top:20px;">
                                        <el-button size="medium" type="primary" @click="pointerQuery" round>查询</el-button>
                                        <el-button size="medium" @click="visible2 = false" pain round>取消</el-button>
                                    </div>
                                    <el-button slot="reference" plain>高级查询</el-button>
                                </el-popover>
                            </div>
                        </div>
                    </el-row>
                    <el-table
                        key='tableKey'
                        :data="list"
                        ref="multipleTable"
                        v-loading.body="listLoading" fit style="width: 100%"
                        @selection-change="handleSelectionChange">
                        <el-table-column
                            type="selection"
                            width="55">
                        </el-table-column>
                        <el-table-column label="序号" width="50">
                            <template slot-scope="scope">
                                <span>{{scope.row.id}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="状态">
                            <template slot-scope="scope">
                                <span>{{scope.row.status}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="实时数据">
                            <template slot-scope="scope">
                                <span  v-if="scope.row.status!=='未启用'">
                                <el-button type="text" @click="viewActual(scope.row.id,scope.row.sensorNo,scope.row.equipmentType)">点击查看</el-button>
                                </span>
                                <span v-else>
                                    暂无数据
                                </span>
                            </template>
                        </el-table-column>
                        <el-table-column label="编号">
                            <template slot-scope="scope">
                                <span>{{scope.row.sensorNo}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="系列">
                            <template slot-scope="scope">
                                <span>{{scope.row.equipmentType}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="型号">
                            <template slot-scope="scope">
                                <span>{{scope.row.model}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="厂商">
                            <template slot-scope="scope">
                                <span>{{scope.row.manufacturer}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="所属系统">
                            <template slot-scope="scope">
                                <span>{{scope.row.channelName}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="所属建筑">
                            <template slot-scope="scope">
                                <span>{{scope.row.bName}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="楼层">
                            <template slot-scope="scope">
                                <span>{{scope.row.floor}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="位置">
                            <template slot-scope="scope">
                                <span>{{scope.row.positionDescription}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="位置标记">
                            <template slot-scope="scope">
                                <span>{{scope.row.positionSign}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="操作" width="130" fixed="right">
                            <template slot-scope="scope">
                                <el-button size="small" plain @click="handleUpdate(scope.row)">
                                    <icon-svg icon-class="bianji" style="fill:#2683f5" />
                                </el-button>
                                <el-button size="small" plain @click="createDel(scope.row)">
                                    <icon-svg icon-class="shanchu" style="fill:#2683f5" />
                                </el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <div v-show="!listLoading" class="sensor-pagination-container">
                        <div>
                            <el-checkbox v-model="isselall" :indeterminate="isIndeterminate" @change="handleCheckAllChange" v-show="list&&list.length!=0">全选</el-checkbox>
                            <el-button type="text" style="margin-left: 10px;" @click="delAllSensor" v-show="list&&list.length!=0" :disabled="checklist&&checklist.length==0">全部删除</el-button>
                        </div>
                        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="listQuery.page" :page-sizes="[10,15,30, 50]" :page-size="listQuery.limit" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination>
                    </div>
                </div>
            </el-container>
            <el-aside width="250px" class="flex-right-pannel_withline">
                <el-scrollbar style="height:85vh">
                  <p class="right-tree-title"><i class="el-icon-caret-right"></i>建筑列表</p>
                <el-tree class="filter-tree" :data="treeData" node-key="code" highlight-current :expand-on-click-node='false' :props="defaultProps" ref="cityTree" @current-change="changeClick" default-expand-all>
                </el-tree>
                </el-scrollbar>
            </el-aside>
        </el-container>
        <el-dialog :title="textMap[dialogStatus]" :visible.sync="isaddsensor" :fullscreen='true' :show-close='false' custom-class="addsensordialog">
            <span class="custom-dialog-btn" @click="cancelAddSensor('addsensorform')">
                <i class="el-icon-close"></i>
            </span>
            <p class="current-building">
                所属建筑：{{buildName}}
            </p>
            <el-form :model="sensorForm" ref="addsensorform" :rules="sensorrules" label-width="100px" label-position='top'>
                <el-form-item label="设备编号" prop="sensorNo">
                <el-input v-model.trim="sensorForm.sensorNo" placeholder="请输入设备编号"></el-input>
                </el-form-item>
                <el-form-item label="厂商 / 系列 / 型号" prop="entity">
                <el-cascader
                    :options="entityOptions"
                    filterable
                    :clearable = 'true'
                    v-model="sensorForm.entity" style="width:100%">
                </el-cascader>
                </el-form-item>
                <el-form-item label="所属系统" prop="channelId">
                    <el-select v-model="sensorForm.channelId" placeholder="请选择所属系统" style="width:100%">
                        <el-option :label="item.channelName" :value="item.id" v-for="(item,index) in systems" :key="index"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="楼层" prop="floor">
                    <el-select v-model="sensorForm.floor" placeholder="请选择楼层" style="width:71%;margin-right:15px" @change="chFloorImg">
                        <el-option :label="item" :value="item" v-for="(item,index) in floors" :key="index"></el-option>
                    </el-select>
                    <el-button class="xf-input-withbtn__rbt" @click="markplace" v-if="planSetup==1">
                        <icon-svg icon-class="checklocal" style="fill:#50E3C2"/>{{sensorForm.positionSign==''?"标记位置":"已标记"}}
                    </el-button>
                </el-form-item>
                <el-form-item label="位置描述" prop="positionDescription">
                    <el-input v-model.trim="sensorForm.positionDescription"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button v-if="dialogStatus=='create'" type="primary" @click="saveSensor('addsensorform')" round size="medium">确 定</el-button>
                <el-button v-else type="primary" @click="updateSensor('addsensorform')" round size="medium">确 定</el-button>
                <el-button @click="sensorForm.entity.length!==0||sensorForm.sensorNo!==''||sensorForm.channelId!==''||sensorForm.floor!==''||sensorForm.positionDescription!==''?isquit=true:cancelAddSensor('addsensorform')" round size="medium">取 消</el-button>
            </div>
            </el-dialog>
             <el-dialog title="导入文件" :visible.sync="dialogImportVisible" :close-on-click-modal="false" :show-close="false" width="400px" top="40vh" custom-class="upload-cum">
                <p class="uploadtitle">导入文件类型：xlsx 或 xls，大小不超过10M</p>
                <el-upload
                class="upload-wrap"
                :class="{filedisabled:uploadDisabled}"
                ref="upload"
                drag
                :headers="token"
                :action="uploadUrl"
                :data="uploadparams"
                :onSuccess="uploadSuccess"
                :on-progress="uploadOnProgress"
                :on-error="uploaderr"
                :beforeUpload="beforeUpload"
                :limit = 1
                >
                <el-button slot="trigger" class="uploadarea">+ 请选择或拖拽上传文件</el-button>
                </el-upload>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="cancelUpload" type="primary" round v-show="!uploadLoading">知道了</el-button>
                </div>
            </el-dialog>

            <el-dialog title="标记位置" :visible.sync="isfloorimg" :show-close='false' custom-class="xf-jc-dialog" width="360px" height="160px">
              <div class="xf-jc-deletect">
                <p>{{isfloorimgtext}}</p>
              </div>
              <div slot="footer" class="dialog-footer">
                <el-button type="primary" round size="medium" @click="goUpload">去上传</el-button>
                <el-button round size="medium" @click="isfloorimg=false">取消</el-button>
              </div>
            </el-dialog>

            <el-dialog title="退出提示" :visible.sync="isquit" :show-close='false' custom-class="xf-jc-dialog" width="360px" height="160px">
              <div class="xf-jc-deletect">
                <p>内容已被修改，退出将不会保留修改内容</p>
              </div>
              <div slot="footer" class="dialog-footer">
                <el-button type="danger" round size="medium" @click="isquit=false;cancelAddSensor('addsensorform');">确定</el-button>
                <el-button round size="medium" @click="isquit=false">取消</el-button>
              </div>
            </el-dialog>

            <el-dialog title="删除传感器" :visible.sync="isdelsensor" :show-close='false' custom-class="xf-jc-dialog" width="360px" height="160px">
              <div class="xf-jc-deletect">
                <p>{{delsensortext}}</p>
              </div>
              <div slot="footer" class="dialog-footer">
                <el-button type="danger" round size="medium" @click="handleDelete">删除</el-button>
                <el-button round size="medium" @click="isdelsensor=false">取消</el-button>
              </div>
            </el-dialog>

            <ActualData :Show.sync="isactiondata" :attr2="channelId" :sensorid="sensorid" :sensornum="sensornum" :sensortype="sensortype"></ActualData>
            <markPlace :Show.sync="ismarkplace" :getimgpath.sync="imgpath" :sensorinfo="sensorinfo" :positionSign.sync="sensorForm.positionSign" @sendMarkInfo="sendMarkInfo"></markPlace>
    </div>
</template>
<script>
import {
  fetchTree,
  advanceSelected,
  firstBuild,
  page,
  getObj,
  delObj,
  putObj
} from "@/api/device/deviceBuilding/index";
import {createSelected,addObj,getAllInfoObj,updateObj,getFloorImg} from "@/api/device/deviceCollectingDevice/index";
import {
  getToken
} from '@/utils/auth';
import markPlace from '@/views/device/deviceManger/components/markPlace';
import ActualData from "@/components/ActualData";
export default {
  name: "sensorTab",
  props:["Show"],
  components:{markPlace,ActualData},
  data() {
    return {
      uploadUrl:'/api/device/deviceSensor/sensorImport',
      planSetup:"0",
      visible2:false,
      showdownload: false,
      isfloorimgtext:"",
      isfloorimg:false,
      isquit:false,
      isactiondata:false,
      isdelsensor:false,
      isselall:false,
      isIndeterminate:false,
      checklist:[],
      sensorid:"",
      channelId:"",
      sensornum:"",
      sensortype:"",
      delsensortext:"",
      sensorinfo:{
        num:"",//编号
        name:""
      },
      token:{'Authorization':getToken()},
      sensorForm:{
        sensorNo:'',
        entity:[],
        channelId:"",
        floor:"",
        positionSign:"",//标记位置
        positionDescription:"",
      },
      styleObject:{
        left:"10px",
        top:"10px"
      },
      treeData: [],
      defaultProps: {
        children: "childList",
        label: "name"
      },
      firstSelected: undefined,
      uploadLoading:false,//上传状态按钮
      list: [],
      total: null,
      listLoading: false,
      slistQuery:{
          status:'-1',
          manufacturer:'全部',
          equipmentType:'全部',
          channelId:'-1',
          positionSign:'-1',
          model:'',
          floorId:'',
          positionDescription:'',
      },
      listQuery: {
        page: 1,
        limit: 15,
        sensorNo: undefined,
        ids: undefined
      },
      systems:[],
      floors:[],
      dialogFormVisible: false,
      dialogDeleteVisible: false,
      dialogImportVisible:false,
      uploadDisabled:false,//上传文件的显隐
      uploadparams:undefined,
      currentSelectObj: {},
      dialogStatus: "",
      textMap: {
        update: "编辑传感器",
        create: "添加传感器"
      },
      tableKey: 0,
      manufeList:[],
      equipmentTypeList:[],
      channelList:[],
      isaddsensor:false,
      ismarkplace:false,
      imgpath:"",
      markleft:"",
      marktop:"",
      entityOptions:[],
      buildName:"",
      curfloor:"",
      delsensorid:[],
      sensorrules: {
        sensorNo: [
          {
            required: true,
            message: "请输入设备编号",
            trigger: "blur"
          },
          {
            min: 1,
            max: 100,
            message: "最多允许输入100个字符",
            trigger: "blur"
          }
        ],
        entity:[{
            required:true,
            message: "请选择 厂商 / 系列 / 型号",
            trigger: ["change"]
        }],
        channelId:[{
            required:true,
            message: "请选择所属系统",
            trigger: ["change"]
        }],
        floor:[{
            required:true,
            message: "请选择楼层",
            trigger: ["change"]
        }],
        /*positionSign:[{
            required: true,
            message: "请选择经纬度",
            trigger: "change"
            }
        ],*/
        positionDescription:[ {
            required: true,
            message: "请输入位置描述",
            trigger: "blur"
          },
          {
            min: 1,
            max: 50,
            message: "最多允许输入50个字符",
            trigger: "blur"
          }]
      },
    };
  },
  created() {
    this.initLoad();
  },
  methods: {
    isparam(){
        let params= this.$route.params;
        return params.hasOwnProperty("id");
    },
    getSelected(){
        // 获取高级查询条件
        advanceSelected().then(response => {
            this.manufeList = response.data.manufacturer;
            this.equipmentTypeList = response.data.equipmentType;
            this.channelList = response.data.channel;
        })
    },
    pointerQuery(){
        // 高级查询
        this.visible2 = false;
        this.listLoading = true;
        // 取消绑定并合并查询条件
        this.slistQuery.floorId += "";
        let contactKeys = Object.assign(JSON.parse(JSON.stringify(this.listQuery)),JSON.parse(JSON.stringify(this.slistQuery)))
        page(contactKeys).then(response => {
            this.list = response.data.rows;
            this.total = response.data.total;
            this.listLoading = false;
        });
    },
    handleClick(){},
    importFn() {
        this.uploadparams = {id:this.listQuery.ids}
        this.dialogImportVisible = true
    },
    cancelUpload(){
        this.$refs.upload.clearFiles();
        this.dialogImportVisible = false;
        this.uploadLoading = false;
    },
    uploadOnProgress(e){
        let progress = Math.floor(e.percent);
        // 如果上传成功
        if (progress == '100' ) {
             this.uploadLoading = true;
        }
    },
    uploadSuccess (response, file, fileList) {
        // 上传成功的回调
        if (response.status=="200") {

            this.cancelUpload();
            this.$message({
                    message: "导入成功！",
                    type: 'success'
                });
            // 刷新列表
            this.initLoad();
        }else if(response.status ==="307"){
            // 文件格式错误
            this.cancelUpload();
            this.$message.error(response.message);
        }else{
            this.cancelUpload();
            this.$message.error(response.message);
            this.uploadLoading = false;
        }
    },
    uploaderr(err){
        this.cancelUpload();
       this.$message.error(JSON.parse(err.message).message);
       this.uploadLoading = false;
    },
    beforeUpload(file){
       var testmsg=file.name.substring(file.name.lastIndexOf('.')+1)
                const extension = testmsg === 'xls'
                const extension2 = testmsg === 'xlsx'
                const isLt2M = file.size / 1024 / 1024 < 10
                if(!extension && !extension2) {
                    this.$message({
                        message: '上传文件只能是 xls、xlsx格式!',
                        type: 'warning'
                    });
                }
                if(!isLt2M) {
                    this.$message({
                        message: '上传文件大小不能超过 10MB!',
                        type: 'warning'
                    });
                }
                return (extension || extension2) && isLt2M
    },
    tableQuery() {
      this.getList();
    },
    handleCreate() {
        this.dialogStatus = "create";
        this.isaddsensor = true;
        this.sensorForm.positionSign = '';
        this.sensorinfo.num="";
        this.sensorinfo.name="";
        getAllInfoObj("",{buildingId:this.listQuery.ids}).then(res=>{
            this.systems=res.data.channel;
            this.floors=res.data.floor;
            this.entityOptions = res.data.options;
        })
    },
    cancelAddSensor(formName) {
        const set = this.$refs;
      set[formName].resetFields();
      this.sensorForm.positionSign="";
      this.handlerest();
      this.isaddsensor = false;
      //this.resetTemp();
    },
    download() {
        window.open("http://file.tmc.turing.ac.cn/sensorImport.xls")
    },
    handleSizeChange(val) {
      this.listQuery.limit = val;
      this.getList();
    },
    handleCurrentChange(val) {
      this.listQuery.page = val;
      this.getList();
    },
    initLoad() {
        let self=this;
      fetchTree().then(data => {
        if (data.data.length!==0) {
        this.treeData = data.data;
        firstBuild().then(data => {
            let isparam=this.isparam();
            if (isparam) {
                this.firstSelected = parseInt(this.$route.params.id);
            }else{
                this.firstSelected = data.data.id;
            }
          this.listQuery.ids = this.firstSelected;
          this.getList();
        }).then(()=>{
            self.$refs.cityTree.setCurrentKey(self.firstSelected);
            let classlist = document.querySelectorAll(
              ".el-icon-caret-right.is-leaf"
            );
            classlist.forEach(item => {
              item.style.color = self.getRandomColor();
              item.classList.add("dot-circl");
            });
            this.buildName =self.$refs.cityTree.getCurrentNode().name;
            this.showdownload = this.firstSelected != -1;
        }).catch(()=>{
            self.listLoading = false;
            });
        }else{

        }
      })
    },
    getList() {
      this.listLoading = true;
      page(this.listQuery).then(response => {
        this.list = response.data.rows;
        this.total = response.data.total;
        this.listLoading = false;
      }).catch(()=>{
          this.listLoading = false;
       })
    },
    getRandomColor() {
      // 随机色生成
      return (
        "#" +
        ("00000" + ((Math.random() * 0x1000000) << 0).toString(16)).substr(-6)
      );
    },
    changeClick(data) {
      if (data.childList) {
        // 如果有下层，隐藏下载按钮
        this.showdownload = false;
        this.listLoading = true;
        this.listQuery.ids = undefined;
        this.listQuery.code = data.code;
        page(this.listQuery).then(data => {
            this.list = data.data.rows;
            this.total = data.data.total;
            this.listLoading = false;
          }).catch(()=>{
          this.listLoading = false;
       })
      } else {
        this.showdownload = true;
        this.listLoading = true;
        this.listQuery.ids = data.code;
        this.buildName=data.name;
        this.listQuery.code = undefined;
        page(this.listQuery).then(data => {
          this.list = data.data.rows;
          this.total = data.data.total;
          this.listLoading = false;
        }).catch(()=>{
          this.listLoading = false;
       })
      }
    },
    markplace(){
        if (this.sensorForm.floor=="") {
            this.$notify({
              title: "提示",
              message: "请选择楼层",
              type: "warning",
              duration: 2000
            });
        }else{
            if (this.imgpath=="") {
                this.isfloorimgtext=`"${this.buildName+","+this.curfloor+"层"}"未上传平面图！`;
                this.isfloorimg=true;
            }else{
                this.sensorinfo.num=this.sensorForm.sensorNo;
                this.sensorinfo.name=this.sensorForm.entity;
                this.ismarkplace=true;
            }
        }
    },
    goUpload(){
        this.$router.push("/adminSys/buildManager")
    },
    sendMarkInfo(pos){
        this.sensorForm.positionSign=pos;
        this.ismarkplace=false;
    },
    markcancel(){
        this.ismarkplace=false;
    },
    handlerest(){
        this.sensorForm.sensorNo='';
        this.sensorForm.entity=[];
        this.sensorForm.channelId='';
        this.sensorForm.floor='';
        this.sensorForm.positionSign='' ;
        this.sensorForm.positionDescription=''
    },
    saveSensor(formName){
        const set = this.$refs;
          set[formName].validate(valid => {
            if (valid) {
              addObj(Object.assign({},this.sensorForm,{buildingId:this.listQuery.ids},{entity:JSON.stringify(this.sensorForm.entity)})).then(() => {
                set[formName].resetFields();
                this.handlerest();
                this.getList();
                this.$notify({
                  title: "成功",
                  message: "创建成功",
                  type: "success",
                  duration: 2000
                });
                this.isaddsensor = false;
              });
            } else {
              return false;
            }
          });
    },
    handleUpdate(row){
        this.dialogStatus = "update";
        this.isaddsensor = true;
        this.cursensorid=row.id;
        let buildingId=this.listQuery.ids||this.listQuery.code;
        getAllInfoObj("",{buildingId:buildingId}).then(res=>{
            this.systems=res.data.channel;
            this.floors=res.data.floor;
            this.entityOptions = res.data.options;
        })
        getAllInfoObj(row.id,{buildingId:buildingId}).then((res) => {
            this.sensorForm.sensorNo=res.data.deviceSensor.sensorNo;
            this.sensorForm.entity=res.data.selectedOptions;
            this.sensorForm.channelId=res.data.deviceSensor.channelId;
            this.curfloor=this.sensorForm.floor=res.data.deviceSensor.floor;
            this.sensorForm.positionSign=res.data.deviceSensor.positionSign;//标记位置
            this.sensorForm.positionDescription=res.data.deviceSensor.positionDescription;
          }).then(()=>{
            getFloorImg({buildingId:buildingId,floor:this.curfloor}).then(res=>{
                if (res.data.length!=0) {
                    this.imgpath=res.data[0].filePath;
                }else{
                    this.imgpath="";
                }
            })
        })
    },
    updateSensor(formName){
        const set = this.$refs;
          set[formName].validate(valid => {
            if (valid) {
              updateObj(Object.assign({},this.sensorForm,{buildingId:this.listQuery.ids,id:this.cursensorid+""},{entity:JSON.stringify(this.sensorForm.entity)})).then(() => {
                this.getList();
                this.$notify({
                  title: "成功",
                  message: "更新成功",
                  type: "success",
                  duration: 2000
                });
                set[formName].resetFields();
                this.handlerest();
                this.isaddsensor = false;
              });
            } else {
              return false;
            }
          });
    },
    chFloorImg(val){
        this.curfloor=val;
        getFloorImg({buildingId:this.listQuery.ids,floor:val}).then(res=>{
            if (res.data.length!=0) {
                this.imgpath=res.data[0].filePath;
                this.sensorForm.positionSign = '';
            }else{
                this.sensorForm.positionSign = '';
                this.imgpath="";
            }
        })
    },
    createDel(row){
        this.delsensortext="删除此传感器将导致该点位的监测数据被清空，确定删除吗？";
        this.delsensorid=[];
        this.delsensorid.push(row.id);
        this.isdelsensor=true;
    },
    handleDelete(){
        delObj(this.delsensorid.toString()).then(res=>{
            this.$notify({
                  title: "成功",
                  message: "删除成功",
                  type: "success",
                  duration: 2000
                });
            this.isdelsensor=false;
            this.getList();
        })
    },
    viewActual(val,num,type){
        this.sensorid=val;
        this.sensornum=num;
        this.sensortype=type;
        this.isactiondata=true;
    },
    handleSelectionChange(val){
      this.checklist=[...val];
      let length = this.total>this.list.length?this.list.length:this.total;
      if (val.length==length) {
        this.isselall=true;
        this.isIndeterminate=false;
      }else{
        this.isselall=false;
        this.isIndeterminate=true;
      }
      if (val.length==0) {
        this.isIndeterminate=false;
      }
    },
    delAllSensor(){
      this.delsensorid=[];
      this.delsensortext=`删除此传感器将导致该点位的监测数据被清空，确定删除吗？`;
      this.checklist.forEach((item,index)=>{
          this.delsensorid.push(item.id);
      });
      this.isdelsensor=true;
    },
    handleCheckAllChange(){
        this.$refs.multipleTable.toggleAllSelection();
    },
  },
  mounted() {
    this.$store.dispatch("getImgAuth").then(()=>{
      this.planSetup=this.$store.getters.planSetup;
    })
  },
  watch:{
    Show:function(val){
      if (val) {
        this.initLoad();
      }
    }
  }
};
</script>
<style rel="stylesheet/scss" lang="scss">
// 随机色背景剪切
.dot-circl {
  background: currentColor;
  clip-path: circle(11%);
}
.flex-right-pannel_withline {
  border-left: 1px solid transparent;
  min-height: 86vh;
  box-sizing: border-box;
  padding-left: 10px;
  padding-top: 10px;
  .el-scrollbar__wrap {
    overflow-x: hidden;
    }
  .el-tree-node__label {
    font-size: 14px;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}
.el-table th {
  background: #f5f7fa;
}
.xf-query-input,
.xf-query-select {
  width: 200px;
  margin: 0 10px;
}
.addsensordialog > div {
  width: 500px;
  margin: 0 auto;
}
.addsensordialog .el-dialog__title {
  font-size: 32px;
}
.addsensordialog {
  .el-dialog__header {
    margin-top: 20px;
  }
  .custom-dialog-btn {
    position: absolute;
    font-size: 30px;
    left: 40px;
    top: 20px;
    color: #fff;
    &:hover {
      cursor: pointer;
    }
  }
  .dialog-footer {
    text-align: left;
  }
  //   带下拉选择的输入
  .tmselect .el-input {
    width: 80px;
  }
  .input-with-select .el-input-group__append {
    background-color: #fff;
  }
}
.xf-input-withbtn__rbt{
    color: #2683F5!important;
}
// 精准查询
.xf-double-form{
    .xf-dbform-item{
        display: flex;
        justify-content: space-between;
        .xf-dbform-item__sleft{
            .el-input{
                width: 320px;
            }
        }
        .xf-dbform-item__sright{
            .el-input{
                width: 320px;
            }
        }
    }
}
.upload-cum{
    .el-dialog__body{
        padding-top: 0;
        min-height: 40px;
        padding-bottom: 10px;
    }
    .dialog-footer{
        text-align: left;
    }
    .el-button.is-disabled{
        background-color: #d9d9d9;
        color: #fff;
        border-color: #d9d9d9;
    }
    .upload-wrap{
        width: 100%;
        margin-top:20px;
        .el-upload{
            width:100%;
        }
    }
    .el-upload-list__item{
        padding: 8px 0;
        background: #f1f1f1;
        .el-icon-close{
            top:14px;
        }
        .el-icon-upload-success{
            vertical-align: bottom;
        }
    }
    .el-upload-dragger{
        height: 40px;
    }
    .filedisabled .el-upload{
        display: none;
    }
    .el-button--default{
        border-color: #dcdfe6;
    }
    .uploadarea{
        width: 100%;
        line-height: 16px;
        background-color: #f1f1f1;
	    border-radius: 2px;
        font-size: 14px;
        color: #666;
    }
    .el-upload-list__item .el-progress{
        top: 30px;
    }
}
.sensor-pagination-container{
    display:flex;
    justify-content:space-between;
    padding:10px 10px;
}
</style>
